<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta content="telephone=no" name="format-detection" />
<title>超级返</title>
<!--标准mui.css-->
<link rel="stylesheet" href="css/mui.min.css">
<!--App自定义的css-->
<link rel="stylesheet" type="text/css" href="css/base.css">
<link rel="stylesheet" type="text/css" href="css/common.css">
<script src="js/jquery.min.js" ></script>
<script src="js/common.js" ></script>
<script src="js/TouchSlide.1.1.js"></script>
<style>
html,body,.mui-content{ max-width:100%; }
.mui-scroll-wrapper{  height:40px; width:auto; right:10px;}
.hot-pro-bot-box{ margin-top:40px;}
.mui-icon-back:before, .mui-icon-left-nav:before{ background-image:url(images/h-back-white.png);}
.mui-bar{ background-color:#dd2727;border-bottom:none;}
.mui-title{ height:50px; line-height:50px; }
.header h1{ color:#fff;}
.banner{ margin-top:40px;}
.nav-out{ position:fixed; top:50px;}
.nav-con{ top:90px; bottom:53px;}
</style>
</head>

<body>
	<div id="indexVm" v-cloak>
  <div id="header" class="search-head header mui-bar mui-bar-nav">
    <h1 class="mui-title">超级返</h1>
    <div class="notice-box">
      <span class="notice-icon"><img src="images/notice-icon.png"><em>{{messagenum}}</em></span>
      <span>消息</span>
    </div>
  </div>
  <!--header-end-->

		<footer class="footer ind-footer mui-bar-tab" id="footer">
			<ul class="display-box-middle">
				<li>
					<a class="on" href="index.html">
						<span class="footer-icon footer-index"></span><span>首页</span>
					</a>
				</li>
				<li>
					<a href="prodCat.html">
						<span class="footer-icon footer-classification"></span><span>分类</span>
					</a>
				</li>
				<li>
	        <a class="on" v-bind:href="'invitationCashBack.html?ruid='+member.id">
	        <span class="footer-icon footer-cash-back"></span><span>超级返</span>
	        </a>
	      </li>
				<li>
					<a href="shoppingcart.html">
						<span class="footer-icon footer-cart"></span><span>购物车</span>
					</a>
				</li>
				<li>
					<a href="userCenter.html">
						<span class="footer-icon footer-my"></span><span>个人中心</span>
					</a>
				</li>
			</ul>
		</footer>
  <!--footer-end-->
<div class="mui-content">
  <!--导航-->
  <div class="nav-out">
    <div class="hot-pro-nav">
      <div class="mui-scroll-wrapper">
          <ul class="mui-scroll clearfix">
            <li><a v-bind:href="'invitationCashBack.html?ruid='+member.id" v-bind:class="prodCategoryId==null ? 'active':''" >全部</a></li>
            <li v-for="wsProdCategory in wsProdCategoryList">
            	<a v-bind:href="'invitationCashBack.html?prodCategoryId='+wsProdCategory.id+'&ruid='+member.id" v-bind:class="prodCategoryId==wsProdCategory.id ? 'active':''">
            		{{wsProdCategory.name}}
            	</a>
           	</li>
          </ul>
      </div>
    </div>
  </div>  
  <!--导航-->

  <!--折叠展开列表内容-->
  <div class="nav-con">
    <ul class="clearfix">
      <li><a href="javascript:void(0)">全部</a></li>
      <li><a v-for="wsProdCategory in wsProdCategoryList" v-bind:href="'invitationCashBack.html?prodCateId='+wsProdCategory.id">{{wsProdCategory.name}}</a></li>
    </ul>
  </div>
  <!--折叠展开列表内容-->
  <!--活动列表-->
  <div class="cash-back-group">
   <div class="cash-back-item" v-for="wsProduct in wsProductList">
     <div class="cash-back-img"><a v-bind:href="'invitationProductDetails.html?id='+wsProduct.id+'&ruid='+member.id"><img v-bind:src="wsProduct.prodImage"></a></div>
     <div class="cash-back-tit">
       <a href="Cash-back-details.html">
         <h2>{{wsProduct.title}}</h2>
       </a>  
     </div>
     <div class="cash-back-bot clearfix">
       <div class="comments-list-bot-price fl">            
          <em>￥<b>{{wsProduct.minPrice}}</b></em>  
          <span>返</span>      
          <strong>{{wsProduct.defaultRewardMoney}}</strong>
       </div>
       <div class="fr clearfix">
         <div class="cash-back-robbed">已抢<em>{{wsProduct.selNum}}</em>件</div>
       </div>
     </div>
   </div>
  </div>
  <!--活动列表-->
</div>
</div>
<!--container-end-->
<script src="js/mui.min.js"></script>
<script src="js/wxshop.js"></script>
<script src="js/vue.js"></script>
<script type="text/javascript" charset="UTF-8" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script>
	var title,desc,link,imgUrl,type,prodCategoryId;
	var vm = new Vue({
		el: '#indexVm',
		data: {
			messagenum: "",
			member: "",
			wsProdCategoryList:[],
			wsProductList:[],
			prodCategoryId: "",
		},
		created: function () {
			prodCategoryId=wxshop.getUrlParam("prodCategoryId"),
			mui.ajax(wxshop.serverUrl+"/reward/list", {
				type: "post",
				data:{
					code:wxshop.getUrlParam("code"),
					prodCategoryId:prodCategoryId,
				},
				dataType: "json",
				success: function(data) {
					if(data.ret==0){
						mui.alert(data.msg);
					}
					if(data.ret==2){
						wxshop.getOpenId(data.appid);
					}					
					vm.messagenum=data.messagenum;
					vm.member=data.member;
					vm.wsProdCategoryList=data.wsProdCategoryList;
					vm.wsProductList=data.wsProductList;
					vm.prodCategoryId=prodCategoryId;
					title=data.title;
					desc=data.desc;
					imgUrl=data.imgUrl;
					link=data.link;
					vm.$nextTick(function () {
						wxshop.wx_config(function () {
							wxshop.wxShareFriend(title,desc,link,imgUrl);
						});
						mui.init({
						  swipeBack: true, //启用右滑关闭功能
						});
						mui('.mui-scroll-wrapper').scroll({
							deceleration: 0.0005, //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
							scrollY: false, //是否竖向滚动
							scrollX: true, //是否横向滚动
							startX: 0, //初始化时滚动至x
							startY: 0, //初始化时滚动至y
							bounce: true, //是否启用回弹
							bounceTime: 500, //回弹动画时间
							scrollTime: 500,
							directionLockThreshold: 5,
							indicators:false
						});
					})
				},
				error: function(xhr,type,errorThrown) {
					mui.alert("后台接口请求失败，请联系管理员！错误"+errorThrown);
				}
			});
		},
	});
	function invitationPord(){
		mui.openWindow({url:"invitationCashBack.html?ruid="+vm.member.id});
	}
</script>
</body>
</html>